import React from 'react'
import { Button, Row, Col } from 'antd'
import {SelectGroup, DateCompare, TextInput} from './corAdvanceFormItem'

//高级搜索的表单
class AdvanceForm extends React.Component {
  constructor(props) {
    super(props);
    this.state = {
      fileds: props.fileds,
      handle: props.handle,
      reset: props.reset,
      fieldHandle: props.fieldHandle,
      childRefs: []
    };
    this.gtChange = this.gtChange.bind(this);
    this.resetForm = this.resetForm.bind(this);
    this.submitForm = this.submitForm.bind(this);
  }
  componentWillReceiveProps(props,next){
    this.setState({
      fileds: props.fileds,
      handle: props.handle,
      reset: props.reset,
      fieldHandle: props.fieldHandle,
    });
  }
  gtChange(value) {
    var val = this.state.val;
    val.eq = '';
    val.gt = value;

    this.setState({val: val});
    this.state.handle(this.state.name, val);
  }
  resetForm() {
    var thisRefs = this.refs;
    for (var key in thisRefs) {
      if (key !== 'advform')
        thisRefs[key].reset();
    }

    thisRefs['advform'].reset();
    this.state.reset();
  }
  submitForm(e) {
    e.preventDefault();
    e.stopPropagation();
    this.state.handle(this.refs.advform);
  }
  render() {
    var self = this;
    var fileds = self.state.fileds.map((item, j)=>{
      return Object.assign({}, item, self.props.fileds[j]);
    });
    var fieldHandle = this.state.fieldHandle;

    return (
      <form ref='advform' onSubmit={this.submitForm} style={{maxHeight:'450px', overflow: 'auto'}}>
        {fileds.map(function (item, key) {
          var item_props = {...item, handle: fieldHandle};
          switch (item.type){
            case 'select' : {
              return <SelectGroup ref={'selectGroup'+key} {...item_props} key={key}/>
              break
            }
            case 'date':{
              return <DateCompare ref={'dateCompare'+key} {...item_props} key={key}/>
              break;
            }
            default: {
              return <TextInput ref={'textInput'+key} {...item_props} key={key}/>
            }
          }
        }.bind(this))}
        <Row style={{marginTop: '15px'}}>
          <Col span={24} style={{textAlign: 'right'}}>
            <Button style={{marginRight: 8}} onClick={this.resetForm}>
              重置
            </Button>
            <Button type="primary" htmlType="submit">确定</Button>
          </Col>
        </Row>
      </form>
    );
  }
}

export default AdvanceForm
